<template>
	<div>
		<div class="weekend-title">周末去哪</div>
		<ul>
			<!--<li class="item border-bottom" v-for="item of weekendList">-->
			<li class="item border-bottom" v-for="item of list">
				<div class="item-img-wrapper">
					<img class="item-img" :src="item.imgUrl"/>
				</div>
				<div class="item-info">
					<p class="item-title">{{item.title}}</p>
					<p class="item-desc">{{item.desc}}</p>
				</div>
			</li>
		</ul>
	</div>
</template>

<script>
	export default {
		name: "HomeWeekend",
		
		props: {
			list: Array
		},
		
		data () {
			return {
				/*weekendList: [
					{
						id: "recommend00000",
						imgUrl: "http://img1.qunarzz.com/sight/source/1901/22/f472e8d5934ef4.jpg_r_640x214_062a9815.jpg",
						title: "茶马古道",
						desc: "骑大马，赏美景"
					},
					{
						id: "recommend00001",
						imgUrl: "http://img1.qunarzz.com/sight/source/1811/3e/461cf59ad72903.jpg_r_640x214_3ab45c93.jpg",
						title: "醉美香格里拉",
						desc: "心中的日月，梦中的香格里拉~"
					},
					{
						id: "recommend00002",
						imgUrl: "http://img1.qunarzz.com/sight/source/1505/3b/04b609bebb288a.jpg_r_640x214_717fd2ba.jpg",
						title: "西双版纳打卡",
						desc: "走进村村寨寨，感受神奇风光"
					},
				]	*/
			}
		}
	}
</script>

<style lang="stylus" scope>
	@import '~@/assets/styles/mixins.styl'
	.weekend-title
		/*margin-top: .1rem*/
		line-height: .8rem
		
	/*.item
		display: flex
		height: 1.9rem
		overflow: hidden*/
	.item-img-wrapper
		height: 0rem
		overflow: hidden
		padding-bottom: 37.09%
	.item-img
		width: 100%
		/*height: 1.7rem
		padding: .1rem*/
	.item-info	
	/*	flex: 1*/
		padding: .1rem
		min-width: 0
	.item-title
		line-height: .54rem
		font-size: .32rem
		ellipsis()
	.item-desc
		line-height: .4rem
		color: #ccc
		/*width: 85%*/
		ellipsis()
</style>